<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>芳芳带你学前端(18040505058)</title>
		<link rel="stylesheet" href="css/index.css">
		
	</head>
<body>
	<div id="table">
		<h2>数据表增删改查</h2>
		<!-- 数据添加	 -->
		<div class="add">
			<input type="text" placeholder="标题" class="title"/>
			<input type="text" placeholder="发布人" class="user"/>
			<input type="date" placeholder="发布时间" class="date"/>
			<button class="addData">新增</button>
		</div>

		<table cellpadding="0" cellspacing="0">
			<thead>
				<tr>
					<th>序号</th>
					<th>发布标题</th>
					<th>发布作者</th>
					<th>发布时间</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody class="tableData">
				<tr>
					<td>1</td>
					<td>孙颖莎世界排名超伊藤美诚</td>
					<td>张三</td>
					<td>2021-08-10</td>
					<td>
						<button class="delete">删除</button>
						<button class="edit" >编辑</button>
					</td>
				</tr>
			</tbody>
		</table>

		<button class="all">多个请求</button>

		<div id="layer">
			<div class="mask">
				<div class="layerTitle">
					编辑
					<span class="close"> × </span>
				</div>
				<div class="content">
					<input type="text"  placeholder="标题" class="editTitle"/>
					<input type="text" placeholder="发布人"  class="editUser"/>
					<input type="date" placeholder="发布时间" class="editDate"/>
					<input type="hidden" class="editId"/>
					<button class="update">更新</button>
					<button class="cancel">取消</button>
				</div>
			</div>
		</div>
	</div>
</body>
<script src="js/axios.js"></script>
<script src="js/index.js"></script>
</html>